<template>
	<div>
		<div class="operatBtnWrapper">
            <button class="operatBtn marR5" @click.stop="routerToAddUser">新建用户</button>
            <el-select v-model="hideCol" @change="showCol" placeholder="请选择要显示的列" class="inputTxtWrapper marR5">
                <el-option
                v-for="item of hideCols"
                :key="Object.keys(item)"
                :label="item[Object.keys(item)][0].title"
                :value="Object.keys(item)[0]">
                </el-option>
            </el-select>
            <el-select v-model="selDepart" @change="showByDepart" placeholder="根据部门筛选" class="inputTxtWrapper">
                <el-option
                v-for="item of allDeparts"
                :key="item.id"
                :label="item.depart_name"
                :value="item.id">
                </el-option>
            </el-select>

		</div>
		<div class="tableWrapper marLR20" v-if="tableShowUserList.length > 0">
                <el-row class="rowClass" v-for="n in (serverPage.currShowSize+1)" :key="n">
                  <!-- <el-col v-for="(item,index) of tableShowUserList" :key="index" :index="index"  :span="item[Object.keys(item)[0]][n-1]['totalVal']" v-dragging="{ item: item, list: tableShowUserList, group: 'item' }"> -->
                  <el-col v-for="(item,index) of tableShowUserList" :key="index" :index="index"  :span="item[Object.keys(item)[0]][n-1]['totalVal']">
                      <!-- 序号，操作表头 -->
                    <div class="paddTB10 theader borderL1 ellipsis" v-if="n === 1 && (Object.keys(item)[0] === 'serialNum' || Object.keys(item)[0] === 'btnIcon')" :title="item[Object.keys(item)[0]][n-1]['value']">
                        {{item[Object.keys(item)[0]][n-1]['value']}}
                    </div>
                    <!-- 权限表头 -->
                    <div class="paddTB10 theader borderL1 ellipsis" v-else-if="n === 1 && Object.keys(item)[0] === 'power'" :title="item[Object.keys(item)[0]][n-1]['value']" v-show="item[Object.keys(item)[0]][n-1]['isShow']">
                        {{item[Object.keys(item)[0]][n-1]['value']}}
                        <div class="operTheaderIconWrapper">
                            <icon name="closeCol" class="scaleIcon1 hideCol" @click.native.stop="hideColumn(Object.keys(item)[0])"></icon>
                        </div>
                    </div>
                    <!-- 部门，邮箱，电话表头 -->
                    <div class="paddTB10 theader borderL1 ellipsis" v-else-if="n === 1 && (Object.keys(item)[0] === 'departs' || Object.keys(item)[0] === 'user_tel' || Object.keys(item)[0] === 'user_email')" :title="item[Object.keys(item)[0]][n-1]['value']" v-show="item[Object.keys(item)[0]][n-1]['isShow']">
                        {{item[Object.keys(item)[0]][n-1]['value']}}
                        <div class="operTheaderIconWrapper">
                            <icon name="closeCol" class="scaleIcon1 hideCol" @click.native.stop="hideColumn(Object.keys(item)[0])"></icon>
                        </div>
                    </div>
                    <!-- 工号，职位，名字，性别，身份证表头 -->
                    <div class="paddTB10 theader borderL1 ellipsis" v-else-if="n === 1" :title="item[Object.keys(item)[0]][n-1]['value']" v-show="item[Object.keys(item)[0]][n-1]['isShow']">
                        {{item[Object.keys(item)[0]][n-1]['value']}}
                        <div class="operTheaderIconWrapper">
                            <span class="tableCaretWrapper posL">
                                <i class="tableSortCaret tableAscending" @click.stop="sortAsc(Object.keys(item)[0])"></i>
                                <i class="tableSortCaret tableDescending" @click.stop="sortDesc(Object.keys(item)[0])"></i>
                            </span>
                            <icon name="closeCol" class="scaleIcon1 hideCol" @click.native.stop="hideColumn(Object.keys(item)[0])"></icon>
                        </div>
                    </div>
                    <!-- 序号 -->
                    <div class="paddTB10 tContent borderL1 ellipsis sortLrCol" :title="item[Object.keys(item)[0]][n-1]['value']" v-else-if="n !== 1 && Object.keys(item)[0] === 'serialNum'">
                        {{item[Object.keys(item)[0]][n-1]['value']}}
                        <!-- <div class="lrArrowsWrapper">
                            <icon name="leftArrow" class="scaleIcon1 leftArrow" @click.native.stop="colMoveLeft(index)" v-if="index !== 0"></icon>
                            <icon name="rightArrow" class="scaleIcon1 rightArrow" @click.native.stop="colMoveRight(index)" v-if="index !== (tableShowUserList.length - 1)"></icon>
                        </div> -->
                    </div>
                    <!-- 权限 -->
                    <div class="paddTB10 tContent borderL1 ellipsis sortLrCol" title="点击可查看用户权限" v-else-if="n !== 1 && Object.keys(item)[0] === 'power'" v-show="item[Object.keys(item)[0]][n-1]['isShow']">
                            <icon name="view" class="scaleIcon1" @click.native.stop="routerToUserMenu(item[Object.keys(item)[0]][n-1]['id'],item[Object.keys(item)[0]][n-1]['value'][0],item[Object.keys(item)[0]][n-1]['value'][1])"></icon>
                            <!-- <div class="lrArrowsWrapper">
                                <icon name="leftArrow" class="scaleIcon1 leftArrow" @click.native.stop="colMoveLeft(index)" v-if="index !== 0"></icon>
                                <icon name="rightArrow" class="scaleIcon1 rightArrow" @click.native.stop="colMoveRight(index)" v-if="index !== (tableShowUserList.length - 1)"></icon>
                            </div> -->
                    </div>
                    <!-- 操作 -->
                    <div class="paddTB10 tContent borderL1 ellipsis sortLrCol" title="操作" v-else-if="n !== 1 && Object.keys(item)[0] === 'btnIcon'">
                        <icon name="change" class="scaleIcon1 marR15" title="修改" @click.native.stop="routerToEditUser(item[Object.keys(item)[0]][n-1]['id'])"></icon>
                        <icon name="reset_pwd" class="scaleIcon1 marR15" title="清空密码并启用账号" @click.native.stop="clearPassword(item[Object.keys(item)[0]][n-1]['id'])"></icon>
                        <icon name="show" class="scaleIcon1" title="隐藏" @click.native.stop="hideUser(item[Object.keys(item)[0]][n-1]['id'],index,n-1)" v-if="item[Object.keys(item)[0]][n-1]['is_user_hide'] === 1"></icon>
                        <icon name="showDisabled" class="scaleIcon1" title="显示" @click.native.stop="showUser(item[Object.keys(item)[0]][n-1]['id'],index,n-1)" v-else-if="item[Object.keys(item)[0]][n-1]['is_user_hide']  === 2"></icon>

                        <!-- <div class="lrArrowsWrapper">
                            <icon name="leftArrow" class="scaleIcon1 leftArrow" @click.native.stop="colMoveLeft(index)" v-if="index !== 0"></icon>
                            <icon name="rightArrow" class="scaleIcon1 rightArrow" @click.native.stop="colMoveRight(index)" v-if="index !== (tableShowUserList.length - 1)"></icon>
                        </div> -->
                    </div>
                    <!-- 用户基本信息 -->
                    <div class="paddTB10 tContent borderL1 ellipsis sortLrCol" :title="item[Object.keys(item)[0]][n-1]['value']" v-else-if="n !== 1" v-show="item[Object.keys(item)[0]][n-1]['isShow']">
                        {{item[Object.keys(item)[0]][n-1]['value']}}
                         <div class="lrArrowsWrapper">
                            <icon name="leftArrow" class="scaleIcon1 leftArrow" @click.native.stop="colMoveLeft(index)" v-if="index !== 1"></icon>
                            <icon name="rightArrow" class="scaleIcon1 rightArrow" @click.native.stop="colMoveRight(index)" v-if="index < (tableShowUserList.length - 3)"></icon>
                        </div>
                    </div>
                  </el-col>
                </el-row>
            </div>

        <div class="tipNoData" v-if="tableShowUserList.length <= 0">暂无部门数据</div> 

        <div class="pagiWrapper" v-if="tableShowUserList.length > 0">
            <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page.sync="serverPage.currPage"
            :page-sizes="[10, 20, 30, 40]"
            :page-size.sync="serverPage.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="serverPage.totalSize">
            </el-pagination>
        </div>


    </div>

    

</template>

<script>
    import http from '@/assets/js/http'
    import _g from '@/assets/js/global'
    import { getPageData} from "@/assets/js/common.js"

    import { mapGetters } from 'vuex'





  export default {
    data() {
      return {

        //   最终呈现的数据结构
        tableShowUserList : [],
          hideCol:'',                                                       //..隐藏的列变量
          hideCols:[],                                                                                  //  被隐藏的列
          serverPage:{                                                                                              //  后台分页                                    
                pageSize:10,                 //  每页显示10个
                totalSize:0,                 //  总记录数
                currPage:1,                    //  当前页码 
                currShowSize:0,     //  当前显示的条数   
            },  
            currSort:{                              //  当前面排序类型,默认根据用户状态升序排列
                sortIdent:'staffnum',         //..排序字段(与数据库保持一致)
                sortType:1,                         //  1升序，2降序    
            },
            allDeparts:[],                          //  所有部门
            selDepart:'all',                                                                    //  当前选择的部门id,默认为所有部门
                                       
                   
      }
    },
    methods: {
        /* 跳转到权限菜单 */
        routerToUserMenu(userId,staffNum,userName){
            this.$router.push({name:'usersMenu', params: {userId,staffNum,userName}})
        },
        /* 左移列 */
        colMoveLeft(index){
            const that = this
            let tableShowUserList = that.tableShowUserList
            let  temp = tableShowUserList[index-1]
            tableShowUserList[index-1] = tableShowUserList[index]
            tableShowUserList[index] = temp
            that.tableShowUserList = [].concat(tableShowUserList)
        },
        /* 右移列 */
        colMoveRight(index){
            const that = this
            let tableShowUserList = that.tableShowUserList
            let  temp = tableShowUserList[index+1]
            tableShowUserList[index+1] = tableShowUserList[index]
            tableShowUserList[index] = temp
            that.tableShowUserList = [].concat(tableShowUserList)
        },
        /* 列升排序 */
        sortAsc(sortIdent){
            const that = this
            let userList = []

            let data = {
                pageSize:that.serverPage.pageSize,
                currPage:that.serverPage.currPage,
                sortIdent,
                sortType:1,
                departId:that.selDepart
            }
            let departsStr = ''
            let url = ''

            // 记录排序类型
            that.currSort.sortIdent = sortIdent         
            that.currSort.sortType = 1         

            _g.showLoading('排序中')
                that.apiPost('admin/users/queryByDepartId', data).then((res) => {
                    _g.showLoading().close()
                    if(typeof res === 'string'){
                        res = JSON.parse(res)
                    }
                    if ((res.code || res.code === 0)  && res.code != 200) {
                        that.handleError(res)
                    } else {
                        if(res.data.isSuccess === 0){
                            
                            if(res.data.userList.data.length > 0){
                                _g.toastMsg("success", res.message)
                                
                                userList = res.data.userList.data
                                if(userList.length > 0){
                                        that.tableShowUserList = [].concat(that.formatServerData(userList))
                                        that.serverPage.totalSize = res.data.userList.total
                                        that.serverPage.currShowSize = res.data.userList.data.length
                                }
                           }else{
                                _g.toastMsg("warning", '暂无数据')
                           }

                        }
                    }
            })
        },

        /* 列降排序 */
        sortDesc(sortIdent){
            const that = this
            
            let userList = []
            let data = {
                pageSize:that.serverPage.pageSize,
                currPage:that.serverPage.currPage,
                sortIdent,
                sortType:2,
                departId:that.selDepart
            }
            let departsStr = ''

             // 记录排序类型
            that.currSort.sortIdent = sortIdent         
            that.currSort.sortType = 2  

            _g.showLoading('排序中')
                that.apiPost('admin/users/queryByDepartId', data).then((res) => {
                    _g.showLoading().close()
                    if(typeof res === 'string'){
                        res = JSON.parse(res)
                    }
                    if ((res.code || res.code === 0)  && res.code != 200) {
                        that.handleError(res)
                    } else {
                        if(res.data.isSuccess === 0){
                            
                                if(res.data.userList.data.length > 0){
                                    _g.toastMsg("success", res.message)
                                    
                                                                //  
                                    userList = res.data.userList.data
                                    if(userList.length > 0){

                                            that.tableShowUserList = [].concat(that.formatServerData(userList))
                                            that.serverPage.totalSize = res.data.userList.total
                                            that.serverPage.currShowSize = res.data.userList.data.length
                                    }
                                }else{
                                        _g.toastMsg("warning", '暂无数据')
                                }

                            }

                    }
            })
        },

        /* 显示列 */
        showCol(){
            const that = this
            let hideCol = that.hideCol                                                  //  隐藏的列变量
            let hideCols = that.hideCols                                                 //  所有隐藏的列

            let tableShowUserList = that.tableShowUserList
            let len = hideCols.length

            for(let i = 0;i < len;i++){
                if(Object.keys(hideCols[i])[0] === hideCol){
                    hideCols.splice(i,1)                                                       //  删除隐藏的列
                    break
                }
            }
            let isHideColFind = false
            for(let j = 0;j < tableShowUserList.length;j++){
                if(Object.keys(tableShowUserList[j])[0] === hideCol){
                    isHideColFind = true
                    for(let k = 0;k < tableShowUserList[j][hideCol].length;k++){
                        tableShowUserList[j][hideCol][k].isShow = true
                    }
                }
                if(isHideColFind){
                    break
                }
            }
            that.hideCols = hideCols
            that.tableShowUserList = tableShowUserList
            that.calColWidth()
        },
        /* 隐藏列  */
       hideColumn(fieldName){
           const that = this
            let hideCols = that.hideCols                                                                                    //  隐藏的列

           let tableShowUserList = that.tableShowUserList
           let  isFieldName = false                                                                                     //  默认没有找到fieldName key
           const len = tableShowUserList.length
           for(let i = 0;i < len;i++){
               if(Object.keys(tableShowUserList[i]) == fieldName){
                   isFieldName = true
                   for(let j = 0; j < tableShowUserList[i][fieldName].length;j++){
                       tableShowUserList[i][fieldName][j]['isShow'] = false
                   }
                   if(isFieldName){
                       hideCols.push(tableShowUserList[i])
                       break                                     //  跳出循环
                   }
               }
           }
           
           that.tableShowUserList = tableShowUserList
            that.calColWidth()
       },

        /* 计算表格列的宽度 */
        calColWidth(){
            const that = this

            let tableShowUserList = that.tableShowUserList

            let totalVal = null                                                     //  计算宽度变量
            let sum = 0
            let len = tableShowUserList.length

            let arr = []
            let btnIconArr = []
            let isAddSum = false
            //    计算宽度比例
            for(let i = 0;i < len - 1;i++){
                arr = tableShowUserList[i][Object.keys(tableShowUserList[i])[0]];                                      //  获取列管理的数据数组
                isAddSum = false
                for(let j = 0;j < arr.length;j++){
                    if(arr[j]['isShow']){
                        totalVal = (24 * arr[j]['iniVal']) / 24
                         tableShowUserList[i][Object.keys(tableShowUserList[i])[0]][j]['totalVal'] =   totalVal  
                         isAddSum = true
                    }
                }
                if(isAddSum){
                    sum += totalVal
                }
            }
            btnIconArr = tableShowUserList[14]['btnIcon']
            for(let k = 0;k < btnIconArr.length;k++){
                btnIconArr[k]['totalVal'] = (24 - sum);
            }

            tableShowUserList[14]['btnIcon'] = btnIconArr

            that.tableShowUserList = tableShowUserList
        },

        /* 根据部门筛选用户 */
        showByDepart(){
            this.sortByCurrSort()
        },

        /* 清空密码并启用账号 */
        clearPassword(id){
            const that = this
            that.$confirm('是否确认清空密码?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                        _g.showLoading('提交中')
                        that.apiPost('admin/users/clearPassword', {id}).then((res) => {
                            _g.showLoading().close()
                            if(typeof res === 'string'){
                                res = JSON.parse(res)
                            }
                            if ((res.code || res.code === 0)  && res.code != 200) {
                                that.handleError(res)
                            } else {
                                if(res.data.isSuccess === 0){
                                    _g.toastMsg("success", res.message)
                                   that.getUserList()
                                }else if(res.data.isSuccess === 1){
                                    _g.toastMsg("error", res.message)
                                }
                            }
                    })
                }).catch(() => {})
        },

        /* 隐藏用户  */
        hideUser(id,colIndex,rowIndex){
            const that = this
            that.$confirm('是否确认隐藏用户?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                        _g.showLoading('隐藏中')
                        that.apiPost('admin/users/hide', {id}).then((res) => {
                            _g.showLoading().close()
                            if(typeof res === 'string'){
                                res = JSON.parse(res)
                            }
                            if ((res.code || res.code === 0)  && res.code != 200) {
                                that.handleError(res)
                            } else {
                                if(res.data.isSuccess === 0){
                                    _g.toastMsg("success", res.message)
                                    that.tableShowUserList[colIndex]['btnIcon'][rowIndex].is_user_hide = 2                                      //  隐藏标识
                                //    that.getUserList()
                                }else if(res.data.isSuccess === 1){
                                    _g.toastMsg("error", res.message)
                                }
                            }
                    })
                }).catch(() => {})
            },
        /* 显示用户  */
        showUser(id,colIndex,rowIndex){
            const that = this
            that.$confirm('是否确认显示用户?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                        _g.showLoading('隐藏中')
                        that.apiPost('admin/users/show', {id}).then((res) => {
                            _g.showLoading().close()
                            if(typeof res === 'string'){
                                res = JSON.parse(res)
                            }
                            if ((res.code || res.code === 0)  && res.code != 200) {
                                that.handleError(res)
                            } else {
                                if(res.data.isSuccess === 0){
                                    _g.toastMsg("success", res.message)
                                    that.tableShowUserList[colIndex]['btnIcon'][rowIndex].is_user_hide = 1                                      //  显示标识
                                //    that.getUserList()
                                }else if(res.data.isSuccess === 1){
                                    _g.toastMsg("error", res.message)
                                }
                            }
                    })
                }).catch(() => {})
            },

      /* 跳转到新增用户页面 */
      routerToAddUser(){
        this.$router.push('/admin/users/add')
      },

      /* 跳转到编辑用户页面 */
      routerToEditUser(id){
        //   this.$router.push({ name: 'usersAdd', params: { id }})
          this.$router.push({ path:'/admin/users/add', query: {id} });
      },


      /* 根据当前排序类型进行排序 */
      sortByCurrSort(){
          const that = this
          const currSort = that.currSort
          if(currSort.sortType === 1){
              that.sortAsc(currSort.sortIdent)
          }else if(currSort.sortType === 2){
              that.sortDesc(currSort.sortIdent)
          }
      },  
      handleSizeChange(){
        this.sortByCurrSort()
      },
      handleCurrentChange(){
         this.sortByCurrSort()
      },
      /* 获取用户列表 */
      getUserList(departId){
            const that = this
                       
            let departsStr = ''
            let userList = []
            let data = {
                pageSize : that.serverPage.pageSize,
                currPage : that.serverPage.currPage,
                departId:that.selDepart,
                sortIdent:'staffnum',
                sortType:1
            }
            _g.showLoading('加载中');
            this.apiPost("admin/users/queryByDepartId",data).then(res => {
                    _g.showLoading().close()
                    if(typeof res === 'string'){
                      res = JSON.parse(res)
                    }
                    if ((res.code || res.code === 0)  && res.code != 200) {
                      this.handleError(res)
                    } else {
                        if(res.data.isSuccess === 0){                           //  
                            userList = res.data.userList.data
                           if(userList.length > 0){

                               that.tableShowUserList = [].concat(that.formatServerData(userList))
                                that.serverPage.totalSize = res.data.userList.total
                                that.serverPage.currShowSize = res.data.userList.data.length

                                console.log('that.tableShowUserList = ',that.tableShowUserList)
                           }
                        }
                    }
              })
      },
      /* 格式化后台传过来的数据 */
      formatServerData(userList){

          let pageSize = this.serverPage.pageSize
          let currPage = this.serverPage.currPage
          let start = (currPage - 1) * pageSize + 1     //          用于计算序号

          let tableShowUserList = [                           //  用户  
                {serialNum:[]},
                {staffnum:[]},
                {departs:[]},
                {pos_name:[]},
                {user_name:[]},
                // {user_state:[]},
                // {skill_level:[]},
                // {experience_level:[]},
                {user_sex:[]},
                // {education:[]},
                // {user_birth:[]},
                {user_card_num:[]},
                {user_tel:[]},
                {user_email:[]},
                {power:[]},
                {btnIcon:[]},
            ]
                               
            //    处理标题
                tableShowUserList[0].serialNum.push({
                    id:'',
                    value:'序号',
                    iniVal:1,
                    totalVal:1,
                    isShow:true,
                    title:'序号'
            })
            tableShowUserList[1].staffnum.push({
                    id:'',
                    value:'工号',
                    iniVal:1,
                    totalVal:1,
                    isShow:true,
                    title:'工号'
            })
            tableShowUserList[2].departs.push({
                    id:'',
                    value: '部门',
                    iniVal:4,
                    totalVal:4,
                    isShow:true,
                    title:'部门'
            })
            tableShowUserList[3].pos_name.push({
                id:'',
                value: '职位',
                iniVal:3,
                totalVal:3,
                isShow:true,
                title:'职位'
            })
            tableShowUserList[4].user_name.push({
                    id:'',
                    value: '名字',
                    iniVal:2,
                    totalVal:2,
                    isShow:true,
                    title:'名字'
            })
            // tableShowUserList[5].user_state.push({
            //         id:'',
            //         value: '状态',
            //         iniVal:1,
            //         totalVal:1,
            //         isShow:true,
            //         title:'状态'
            // })
            // tableShowUserList[6].skill_level.push({
            //         id:'',
            //         value: '技能',
            //         iniVal:1,
            //         totalVal:1,
            //         isShow:true,
            //         title:'技能'
            // })
            // tableShowUserList[7].experience_level.push({
            //         id:'',
            //         value: '经验',
            //         iniVal:1,
            //         totalVal:1,
            //         isShow:true,
            //         title:'经验'
            // })
            tableShowUserList[5].user_sex.push({
                    id:'',
                    value: '性别',
                    iniVal:1,
                    totalVal:1,
                    isShow:true,
                    title:'性别'
            })
            // tableShowUserList[9].education.push({
            //         id:'',
            //         value: '学历',
            //         iniVal:1,
            //         totalVal:1,
            //         isShow:true,
            //         title:'学历'
            // })
            tableShowUserList[6].user_card_num.push({
                    id:'',
                    value: '身份证号',
                    iniVal:3,
                    totalVal:3,
                    isShow:true,
                    title:'身份证号'
            })
            tableShowUserList[7].user_tel.push({
                    id:'',
                    value: '电话',
                    iniVal:3,
                    totalVal:3,
                    isShow:true,
                    title:'电话'
            })
            tableShowUserList[8].user_email.push({
                    id:'',
                    value: '邮箱',
                    iniVal:2,
                    totalVal:2,
                    isShow:true,
                    title:'邮箱'
            })
                tableShowUserList[9].power.push({
                    id:'',
                    value: '权限',
                    iniVal:1,
                    totalVal:1,
                    isShow:true,
                    title:'权限'
            })
            tableShowUserList[10].btnIcon.push({
                    id:'',
                    value: '操作',
                    iniVal:3,
                    totalVal:3,
                    isShow:true,
                    title:'操作'
            })
                
                for(let i = 0; i < userList.length;i++){
                    //    序号
                    tableShowUserList[0].serialNum.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            // value:i+1,
                            value:i+start,
                            iniVal:1,
                            totalVal:1,
                            isShow:true,
                            title:'序号'
                    })
                    
                    //    工号
                    tableShowUserList[1].staffnum.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value:userList[i].staffnum,
                            iniVal:1,
                            totalVal:1,
                            isShow:true,
                            title:'工号'
                    })

                    //    部门
                    tableShowUserList[2].departs.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: userList[i].dNames,
                            iniVal:4,
                            totalVal:4,
                            isShow:true,
                            title:'部门'
                    })

                    //    职位
                        tableShowUserList[3].pos_name.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: userList[i].pos_name,
                            iniVal:3,
                            totalVal:3,
                            isShow:true,
                            title:'职位'
                    })

                    //    名字
                    tableShowUserList[4].user_name.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: userList[i].user_name,
                            iniVal:2,
                            totalVal:2,
                            isShow:true,
                            title:'名字'
                    })

                    //    状态
                    // let state = ''
                    // if(userList[i].user_state === 1){
                    //     state = '在职'
                    // }else if(userList[i].user_state === 2){
                    //     state = '离职'
                    // }else if(userList[i].user_state === 3){
                    //     state = '实习'
                    // }else if(userList[i].user_state === 4){
                    //     state = '休假'
                    // }
                    // tableShowUserList[5].user_state.push({
                    //         id:userList[i].id,
                    //         is_user_hide:userList[i].is_user_hide,
                    //         value: state,
                    //         iniVal:1,
                    //         totalVal:1,
                    //         isShow:true,
                    //         title:'状态'
                    // })

                    //    技能
                    // tableShowUserList[6].skill_level.push({
                    //         id:userList[i].id,
                    //         is_user_hide:userList[i].is_user_hide,
                    //         value: userList[i].skill_level,
                    //         iniVal:1,
                    //         totalVal:1,
                    //         isShow:true,
                    //         title:'技能'
                    // })

                    //    经验
                    // tableShowUserList[7].experience_level.push({
                    //         id:userList[i].id,
                    //         is_user_hide:userList[i].is_user_hide,
                    //         value: userList[i].experience_level,
                    //         iniVal:1,
                    //         totalVal:1,
                    //         isShow:true,
                    //         title:'经验'
                    // })

                    //    性别
                    let sex = ''
                    if(userList[i].user_sex === 1){
                        sex = '男'
                    }else if(userList[i].user_sex === 2){
                        sex = '女'
                    }
                        tableShowUserList[5].user_sex.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: sex,
                            iniVal:1,
                            totalVal:1,
                            isShow:true,
                            title:'性别'
                    })

                    //    学历
                    // let education = ''
                    // if(userList[i].education === 1){
                    //     education = '初中'
                    // }else if(userList[i].education === 2){
                    //     education = '高中'
                    // }else if(userList[i].education === 3){
                    //     education = '大专'
                    // }else if(userList[i].education === 4){
                    //     education = '本科'
                    // }else if(userList[i].education === 5){
                    //     education = '硕士'
                    // }else if(userList[i].education === 6){
                    //     education = '博士'
                    // }
                    //     tableShowUserList[9].education.push({
                    //         id:userList[i].id,
                    //         is_user_hide:userList[i].is_user_hide,
                    //         value: education,
                    //         iniVal:1,
                    //         totalVal:1,
                    //         isShow:true,
                    //         title:'学历'
                    // })

                    //    身份证号
                    tableShowUserList[6].user_card_num.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: userList[i].user_card_num,
                            iniVal:3,
                            totalVal:3,
                            isShow:true,
                            title:'身份证号'
                    })

                    //    电话
                        tableShowUserList[7].user_tel.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: userList[i].user_tel,
                            iniVal:3,
                            totalVal:3,
                            isShow:true,
                            title:'电话'
                    })

                    //    邮箱
                    tableShowUserList[8].user_email.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: userList[i].user_email,
                            iniVal:2,
                            totalVal:2,
                            isShow:true,
                            title:'邮箱'
                    })

                    //    权限
                    tableShowUserList[9].power.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: [userList[i].staffnum,userList[i].user_name],
                            iniVal:1,
                            totalVal:1,
                            isShow:true,
                            title:'权限'
                    })

                    //    操作
                    tableShowUserList[10].btnIcon.push({
                            id:userList[i].id,
                            is_user_hide:userList[i].is_user_hide,
                            value: '',
                            iniVal:3,
                            totalVal:3,
                            isShow:true,
                            title:'操作'
                    })
                }
                return tableShowUserList
      },

      /* 获取部门列表 */
      getDepartList(){
            const that = this
            let allDeparts = []           //  所有部门    
            let selDepart =  {                                                                   //  默认选中所有部门
                depart_name:'所有部门',
                id:'all',
                is_show:'all',
                userLen:'all',
            }       
            _g.showLoading('部门加载中');
            this.apiPost("admin/addDepart").then(res => {
                    _g.showLoading().close()
                    if(typeof res === 'string'){
                      res = JSON.parse(res)
                    }
                    if (res.code != 200) {
                      this.handleError(res)
                    } else {
                        if(res.data.isSuccess === 100){
                            _g.toastMsg("error", res.message)
                            that.$router.push('/')
                        }
                        
                        allDeparts = res.data.departList

                        allDeparts.push(selDepart)
                        that.allDeparts = allDeparts
                    }
              })
      },
    },
    created() {
        this.getDepartList()
        this.getUserList()
    },
    computed: {
        ...mapGetters([                                                                         //  用户权限
                'roles',
        ])
    },
    components: {
    },
    mixins: [http]
  }
</script>